import React,{ FC, Suspense } from 'react';
import { BrowserRouter, Switch, Route,RouteComponentProps } from 'react-router-dom';

import routes from "../routes";
import routesType from "../routes/routesType";

import ErrorBoundary from "../components/err/ErrorBoundary";

const App:FC = ()=>(
  <BrowserRouter>
    <Switch>
      {
        routes.map((r:routesType,i:number) => (
            <Route exact key={i}
                   path={r.path}
                   render={(props:RouteComponentProps) => {
                     document.title = r.title;
                     return (
                       <ErrorBoundary>
                         <Suspense fallback={<div />}>
                             <r.component {...props}/>
                         </Suspense>
                       </ErrorBoundary>
                     )
                   }}
            />
          ))
      }
    </Switch>
  </BrowserRouter>
);

export default App;
